import * as echarts from '../../ec-canvas/echarts';
const api = require("../../config/api.js")
const app = getApp()

//折线图
function initChart(canvas, width, height, dpr) {
    const chart = echarts.init(canvas, null, {
      width: width,
      height: height,
      devicePixelRatio: dpr
    })
    canvas.setChart(chart)
    var option = {
        legend: false,
          grid: {
            top: '20%',
            left: '3%',
            right: '6%',
            bottom: '3%',
            containLabel: true
          },
          xAxis: [
            {
              type: 'category',
              boundaryGap: false,
              data: ['10-20', '10-21', '10-22', '10-23', '10-24', '10-25', '10-26']
            }
          ],
          yAxis: [
            {
                name: '℃',
                nameLocation: 'end',  // 坐标轴名称显示在结束位置（y轴顶部）
                nameTextStyle: {
                  fontSize: 12,
                  color: '#666666'
                },
                axisLine: {
                  show: true, 
                  lineStyle: {
                      width: 1,      
                      type: 'solid'  
                    }
                  },
              splitLine: {
                show: false
              },
              type: 'value',
              min: 0,
              max: 50
            }
          ],
          series: [
            {
              name: 'Line 1',
              type: 'line',
            //   stack: 'null',
              smooth: true,
              lineStyle: {
                width: 2,
                color: '#80FFA5'
              },
              showSymbol: false,
              emphasis: {
                focus: 'series'
              },
              data: [20, 18, 32, 10, 22, 9, 30]
            },
            {
              name: 'Line 2',
              type: 'line',
            //   stack: 'null',
              smooth: true,
              lineStyle: {
                width: 2,
                color: '#D41A23'
              },
              showSymbol: false,
              emphasis: {
                focus: 'series'
              },
              data: [28, 20, 30, 21, 6, 11, 32, 21]
            },
            {
              name: 'Line 3',
              type: 'line',
            //   stack: 'Total',
              smooth: true,
              lineStyle: {
                width: 2,
                color: '#0057A5'
              },
              showSymbol: false,
              emphasis: {
                focus: 'series'
              },
              data: [33, 25, 16, 38, 12, 8, 19]
            },
            {
              name: 'Line 4',
              type: 'line',
              stack: 'Total',
              smooth: true,
              lineStyle: {
                width: 2,
                color: '#0073BD'
              },
              showSymbol: false,
              emphasis: {
                focus: 'series'
              },
              data: [8, 12, 25, 34, 27, 18, 33]
            } 
          ]
        };
        chart.setOption(option);
        return chart;
    }


Page({
  data: {
    deviceID:'',
    sensorID:'',
    historyMonitor:{},
    ec: {
        onInit: initChart
      },
  },

  onBack:function(e){
    wx.navigateBack({delta: 1});
  },
  onData1:function(e){
      wx.navigateTo({
        url: '/pages/FirstPage/Data1/Data1',
      })
  },
  onData2:function(e){
      wx.navigateTo({
        url: '/pages/FirstPage/Data2/Data2',
      })
  },
  /**
   * 生命周期函数--监听页面加载
   */
  onLoad(options) {
    const sensorID = options.sensorID;
    console.log('传递sensorID:', sensorID);
    const deviceID = options.deviceID;
    console.log('传递deviceID:', deviceID);
    if(deviceID!=null){
      this.setData({
        deviceID:deviceID,
      })
      this.getDeviceData(deviceID)
    }else{
      this.setData({
        sensorID:sensorID,
      })
      this.getSensorData(sensorID)
    }
  },
  getDeviceData(deviceID){
    console.log('开始获取设备数据',deviceID)
    wx.request({
      url: api.monitorData,
      method: 'POST',
      data: {
        deviceID: deviceID,
        pageNum: "1",
        pageSize: "10",
        startTime:"2024-12-16T00:00:00.000+08:00",
        endTime:"2024-12-20T23:59:59.000+08:00"
      },
      success: (res) => {
        console.log("历史监测数据：")
          console.log(res.data)
        if (res.data.code == 200) {
          console.log("历史监测数据：")
          console.log(res.data.data)
          const resData = res.data.data.historyMonitor;
          this.setData({
            historyMonitor:resData
          })
          console.log('historyMonitor:',this.data.historyMonitor)
        } else {
          wx.showToast({
            title: res.data.mesage,
            icon: "none"
          })
        }
      }
    })
  },
  getSensorData(sensorID){
    console.log("历史传感器监测数据1：")
    wx.request({
      url: api.monitorData,
      method: 'POST',
      data: {
        sensorID: sensorID,
        pageNum: "1",
        pageSize: "10",
        time:'2024-12-13',
      },
      success: (res) => {
        console.log("历史传感器监测数据2：")
        console.log(res.data)
        wx.hideLoading()
        if (res.data.code == 200) {
          console.log("历史传感器监测数据：")
          console.log(res.data.data)
          const resData = res.data.data.historyMonitor;
          this.setData({
            historyMonitor:resData
          })
        } else {
          wx.showToast({
            title: res.data.mesage,
            icon: "none"
          })
        }
      }
    })
  },
  /**
   * 生命周期函数--监听页面初次渲染完成
   */
  onReady: function () {
    //获得popup组件
    this.popup = this.selectComponent("#popup");
  },
  
  showPopup() {
    // this.popup.showPopup();
  },
  
  //取消事件
  onClickCancel() {
    wx.showToast({
      title: '点击了取消',
    })
    this.popup.hidePopup();
  },
  //确认事件
  onClickConfirm() {
    wx.showToast({
      title: '点击了确定',
    })
    this.popup.hidePopup();
  }
})